<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <meta name="referrer" content="no-referrer" />
    <title>商品详情</title>
    <!-- <link href="../styles/jquery.exzoom.css" rel="stylesheet"> -->
    <link rel="stylesheet" href="../styles/gonggong.css">
    <link rel="stylesheet" href="../styles/xqandfd.css">


</head>

<body>

    <div id="detail-index" class="clearfix">
        <section id="container">
            <!-- 顶部导航 -->
            <div class="header">
                <div>
                    <nav class="detailNav clearfix">
                        <a class="back" href="../html/yspbuy.html">
                            《&nbsp;返回
                        </a>&nbsp;
                        <!-- 要渲染的部分1 -->
                        <span>
                            <a href="index.html">艺网 › </a>
                            <a href="yspbuy.html">艺术品 › </a>
                            <a href="#">fewly › </a><!-- ${list[i].sender.username} -->
                            <a>羊毛垫</a><!-- ${list[i].msg} -->
                        </span>
                        <!-- 右侧图标 -->
                        <div class="f-r">
                            <div class="headimgbox">
                                <div>
                                    <a class="usercenter" href="dl.html">
                                        <img src="https://cdn.ywart.com/header/login.png" alt="">
                                    </a>
                                    <div class="login-hover">
                                        <i></i>
                                        <ul>
                                            <li><a href="#">会员中心</a></li>
                                            <li><a href="#">我的珍藏</a></li>
                                            <li><a href="#">我的订单</a></li>
                                            <li><a href="#">我的购物车</a></li>
                                            <li><a href="#">退出</a></li>
                                        </ul>
                                    </div>
                                </div>
                                <a class="gwc" href="gwc.html" onclick="_hmt.push(['_trackEvent', '浏览', '购物车']);">
                                    <img src="https://cdn.ywart.com/header/car.png" alt="">
                                    <i>0</i>
                                </a>
                            </div>
                        </div>
                    </nav>
                </div>
            </div>
            
            <!-- 商品详情 需要渲染的部分 --> 
            <section class="datailBox clearfix">
                <!-- 左侧图片 -->
                <div class="goodsimg">
                    <!--大图区域-->
                    <div class="goodsimgbox">
                        <div class="img">
                            <!-- 渲染的大图 -->
                            <img class="xrimg1" src="https://cdn.ywart.com/yw/20190804151457351d4fffa78.jpg"/>
                            <span></span>
                            <div class="fangdade">
                                <img src="https://cdn.ywart.com/yw/20190804151457351d4fffa78.jpg" alt="">
                            </div>
                        </div>

                        <!--缩略图导航-->
                        <div class="otherimg clearfix">
                            <!-- 渲染缩略图 -->
                            <img src="https://cdn.ywart.com/yw/20190804151457351d4fffa78.jpg" alt="">
                        </div>                                               
                    </div>
                </div>
                <!-- 右侧详情 -->
                <div class="goodInFo">
                    <div class="btns">
                        <span class="buyInfoBtn active">价格</span>
                        <span class="artInfoBtn f_r">
                            <i class="_hidden">点击查看作品信息</i>作品信息
                        </span>                        
                    </div>
                    <!-- 需要渲染的部分 -->
                    <div class="buyInFo">                       
                        <p class="price"><!-- 价格 --></p>
                        <div class="classify">
                            <ul>
                                <li class="yspname">
                                    <img src="https://cdn.ywart.com/content/image/原创.png" alt="">
                                    <!-- 名称 -->
                                </li>
                                <li class="yspzuozhe">
                                    <img src="https://cdn.ywart.com/content/image/原创.png" alt="">
                                    <!-- 作者 -->
                                </li>
                            </ul>
                        </div>
                        <div class="riqi">
                            <!-- 日期 -->
                        </div>
                        <button class="cart detailBtn" style="top: 0px;">
                            <i>加入购物车</i>
                    </button>
                    </div>                    
                </div>             
            </section>
        </section>        
    </div>

</body>

<script src="../javascripts/jquery.js"></script>
<script src="../javascripts/fzhs.js"></script>
<script src="../javascripts/xqandfd.js"></script>

</html>